<form class="layui-form" action="{:url()}" method="post" id="editForm">
    
    <div class="layui-form-item">
        <label class="layui-form-label">商品标题</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-name" name="name" autocomplete="off" lay-verify="required"  placeholder="请输入商品标题">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">副标题</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-sub_name" name="sub_name" autocomplete="off"   placeholder="请输入副标题">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">所属分类</label>
        <div class="layui-input-inline w200">
            <select name="type_id" class="field-type_id" type="select" lay-verify="required">
                <!-- <option value="0">无</option> -->
                {$category|raw}
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">开启或者隐藏</label>
        <div class="layui-input-inline  w200">
            <select name="status" id="" class="field-status">
                <option value="1">上架</option>
                <option value="0">隐藏</option>
                <option value="-1">下架</option>
            </select>
        </div>
    </div>
    
    <div class="layui-form-item">
        <label class="layui-form-label">权重</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-orders" name="orders" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">是否推到首页折扣列表</label>
        <div class="layui-input-inline  w200">
            <select name="is_zhekou" id="" class="field-is_zhekou">
                <option value="0">否</option>
                <option value="1">是</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">是否推荐到首页-产品推荐</label>
        <div class="layui-input-inline  w200">
            <select name="is_recommend" id="" class="field-is_recommend">
                <option value="0">否</option>
                <option value="1">是</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">价格描述</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-price_describe" name="price_describe" autocomplete="off">
        </div>
    </div>

    <!-- <div class="layui-form-item">
        <label class="layui-form-label">是否可用优惠券</label>
        <div class="layui-input-inline  w200">
            <select name="can_use_quan" id="" class="field-can_use_quan">
                <option value="0">否</option>
                <option value="1">是</option>
            </select>
        </div>
    </div> -->
    <!-- <div class="layui-form-item">
        <label class="layui-form-label">库存</label>
        <div class="layui-input-inline">
            <input type="text" data-disabled class="layui-input field-rest_num" name="rest_num" autocomplete="off" placeholder="请输入库存">
        </div>
    </div> -->
    <div class="layui-form-item">
        <label class="layui-form-label">虚增销量</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-other_buy_count" name="other_buy_count" autocomplete="off" >
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">虚增浏览量</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-other_view_count" name="other_view_count" autocomplete="off" >
        </div>
    </div>
    
    <!-- <div class="layui-form-item">
        <label class="layui-form-label">C端默认售卖价格</label>
        <div class="layui-input-inline">
            <input type="text" data-disabled class="layui-input field-show_price" name="show_price" autocomplete="off" >
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">默认内购价格</label>
        <div class="layui-input-inline">
            <input type="text" data-disabled class="layui-input field-show_price_inner" name="show_price_inner" autocomplete="off" >
        </div>
    </div>
     -->
    <div class="layui-form-item">
        <label class="layui-form-label">采购送礼价</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-slcg_price" name="slcg_price" autocomplete="off"  lay-verify="required">
        </div>
        <div class="layui-form-mid layui-word-aux">所有人（内部员工及C端用户）同价购买，不返积分</div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">采购送礼规格</label>
        <div class="layui-input-inline">
            <input type="text"  class="layui-input field-slcg_spec" name="slcg_spec" autocomplete="off"  >
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">库存转换比</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-unit_transform" name="unit_transform" autocomplete="off" lay-verify="required">
        </div>
        <div class="layui-form-mid layui-word-aux">1件=x库存</div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="x-red">*</span>商品库存</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-rest_num" name="rest_num" autocomplete="off" >
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">划线价格</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input field-line_price" name="line_price" autocomplete="off" >
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">库存预警值</label>
        <div class="layui-input-inline">
            <input type="text"  class="layui-input field-rest_num_notify" name="rest_num_notify" autocomplete="off" >
        </div>
    </div>
    <div id="spec">
        {:$spec?$spec:''}
        {if condition="!$spec"}
        <div class="layui-form-item">
            <label class="layui-form-label">商品规格</label>
            <div class="layui-inline layui-show-xs-block specname " >
                <input type="text"  name="spec[spec_num][]"  placeholder="数量"   autocomplete="off" class="layui-input" value="">
            </div>
            <div class="layui-inline layui-show-xs-block specname " >
                <input type="text"  name="spec[spec_unit][]"  placeholder="规格名称"   autocomplete="off" class="layui-input" value="">
            </div>
            <div class="layui-inline ">
                <input type="text" name="spec[price][]" placeholder="该规格C端价格" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-inline ">
                <input type="text" name="spec[price_inner][]" placeholder="该规格内购价格" autocomplete="off" class="layui-input">
            </div>
            <!-- <div class="layui-inline ">
                <input type="text" name="spec[price_gift][]" placeholder="请输入该规格采购送礼价" autocomplete="off" class="layui-input"  lay-verify="required">
            </div> -->
            <!-- <div class="layui-inline">
                <input type="text" name="spec[rest_num][]" placeholder="请输入该规格库存" autocomplete="off" class="layui-input"  lay-verify="required">
            </div> -->

            <div class="layui-inline layui-show-xs-block" style="margin-left: 45px;">
                <a class="layui-btn layui-btn-xs add">添加</a>
                <a class="layui-btn layui-btn-danger layui-btn-xs del">删除</a>
            </div>
        </div>
        {/if}
    </div>
    
    <!-- <div class="layui-form-item">
        <label class="layui-form-label"><span class="x-red">*</span>积分设置</label>
        每消费<div class="layui-inline layui-show-xs-block specname " >
            <input type="text"  name="jifen_price"  placeholder="请输入金额"   autocomplete="off" class="layui-input field-jifen_price" value="" >
        </div>元
        得<div class="layui-inline ">
            <input type="text" name="jifen" placeholder="请输入积分"  autocomplete="off" class="layui-input field-jifen">
        </div>积分
    </div> -->

    <div class="layui-form-item">
        <label class="layui-form-label">商品主图</label>
            <div class="layui-input-inline upload1">
                <button type="button" name="share_img" class="layui-btn layui-btn-primary layui-upload1" lay-type="image" lay-data="{accept:'image'}">请上传图片</button>
                <input type="hidden" class="upload-input field-share_img" name="share_img">
                {if condition="!empty($formData['share_img'])"}
                <img src="{$formData['share_img']}" style="border-radius:5px;border:1px solid #ccc" width="36" height="36">
                {else /}
                <img src="" style="display:none;border-radius:5px;border:1px solid #ccc" width="36" height="36">
                {/if}
            </div>
            <div class="layui-form-mid layui-word-aux">作用于商城列表、分享头图；建议尺寸：750*750像素</div>
    </div>
    
    <!-- <div class="layui-form-item">
        <label class="layui-form-label">上传照片</label>
        <div class="layui-input-inline uploadHeadImage">
            <div class="layui-upload-drag" id="headImg">
                <i class="layui-icon"></i>
                <p>点击上传图片，或将图片拖拽到此处</p>
            </div>
        </div>
        预览图：
        <div class="layui-upload-list" id="demo2">{:$li?$li:''}</div>

        <input type="text" id="banner" name="banner" style="display: none;" class="layui-input field-banner">
    </div> -->

    <input type="hidden" name="banner" class="multiple_show_img field-banner">
    <div class="layui-form-item">
        <label class="layui-form-label">轮播图片：</label>
        <div class="layui-upload">
            <button type="button" class="layui-btn" id="multiple_img_upload">多图片上传</button>
            <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
            预览：
            <div class="layui-upload-list" id="div-slide_show">{:$li?$li:''}</div>
            </blockquote>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">商品详情</label>
        <div class="layui-input-inline" style="width:800px;">
            <textarea id="UMeditor2" name="describes" >{$formData['describes']?$formData['describes']|raw:''}</textarea>
        </div>
    </div>
    
    <div class="layui-form-item">
        <div class="layui-input-block">
            <input type="hidden" class="field-id" name="id">
            <input type="hidden" class="field-type" name="type" value="{$type}">
        </div>
    </div>
    <div class="pop-bottom-bar hisi-footer">
        <button type="submit" class="layui-btn layui-btn-normal" lay-submit="" lay-filter="formSubmit" lay-data="{pop: true, refresh: true}">提交保存</button>
        <a href="javascript:parent.layui.layer.closeAll();" class="layui-btn layui-btn-primary ml10">取消</a>
    </div>
</form>
{include file="system@block/layui" /}
<script>
var s = "";
var $ = layui.$;
//多图容器 【注册全局变量】

layui.use(['func'], function() {
    layui.func.assign({:json_encode($formData)});
});
var multiple_images = [];
console.log('>>>'+multiple_images);
layui.use(["jquery", "upload", "form", "layer", "element"], function () {
        element = layui.element,
        layer = layui.layer,
        upload = layui.upload,
        form = layui.form;
    

    //拖拽上传
    // var uploadInst = upload.render({
    //     elem: '#headImg'
    //     , url: '{:url("system/annex/upload?water=&thumb=&from=&group=")}'
    //     , multiple: true
    //     , before: function (obj) {
    //         //预读本地文件示例，不支持ie8
    //         obj.preview(function (index, file, result) {
    //             // $('#demo1').attr('src', result); //图片链接（base64）
    //             $('#demo2').append('<img src="' + result
    //                 + '" alt="' + file.name
    //                 + '"height="100px" width="100px" class="layui-upload-img uploadImgPreView">')


    //         });
    //         $("#banner").val('');
    //     }
    //     , done: function (res) {
    //         console.log(res);
    //         //上传完毕
    //         if (res.code == 1) {
    //             console.log(666);
    //             var last_url = $("#banner").val();
    //             var upload_image_url = "";
    //             if(last_url){
    //                 upload_image_url = last_url+","+res.data.file;
    //             }else {
    //                 upload_image_url = res.data.file;
    //             }
    //             // console.log(upload_image_url);
    //             $("#banner").val(upload_image_url);
    //         }
    //     }           
    //     , error: function () {
    //         demoText.find('.demo-reload').on('click', function () {
    //             uploadInst.upload();
    //         });
    //     }
        
    // });

    
    layui.use('upload', function () {
        var upload = layui.upload;
        //多图片上传
        upload.render({
        elem: '#multiple_img_upload'
        ,url: '{:url("system/annex/upload?water=&thumb=&from=&group=")}'
        ,multiple: true
        ,before: function(obj){
            //预读本地文件示例，不支持ie8
            obj.preview(function(index, file, result){
                $('#div-slide_show').append('<img src="'+ result +'" alt="'+ file.name +'" title="点击删除" class="layui-upload-img" onclick="delMultipleImgs(this)" height="100px">')
            });
        }
        ,done: function(res){
            //如果上传成功
            if (res.code == 1) {
                //追加图片成功追加文件名至图片容器
                multiple_images.push(res.data.file);
                $('.multiple_show_img').val(multiple_images);
            }
            else {
                //提示信息
                // dialog.tip(res.message);
                layer.alert(res.msg);
            }
        }
        });
    });

    

    upload.render({
        elem: '.layui-upload1'
        ,url: '{:url("system/annex/upload?water=&thumb=&from=&group=")}'
        ,method: 'post'
        ,before: function(input) {
            layer.msg('文件上传中...', {time:3000000});
        },done: function(res, index, upload) {
            console.log(res);
            var obj = this.item;
            if (res.code == 0) {
                layer.msg(res.msg);
                return false;
            }
            layer.closeAll();
            var input = $(obj).parents('.upload1').find('.upload-input');
            if ($(obj).attr('lay-type') == 'image') {
                input.siblings('img').attr('src', res.data.file).show();
            }
            input.val(res.data.file);
        }
    });
    

    // 动态 增删 规格信息
    var i=0;
    $('#spec').on('click', '.add', function(data) {
        console.log(data);
        i++;
        var html = `<div class="layui-form-item">`+
            `<label class="layui-form-label"><span class="x-red">*</span>商品规格</label>`+
            `<div class="layui-inline" >`+
            ` <input type="text" id="" name="spec[spec_num][]" placeholder="数量"   autoComplete="off" class="layui-input" value="">`+
            `</div>`+
            `<div class="layui-inline specname" >`+
            ` <input type="text" id="" name="spec[spec_unit][]" placeholder="规格名称"   autoComplete="off" class="layui-input" value="">`+
            `</div>`+
            `<div class="layui-inline">`+
            `<input type="text" name="spec[price][]" placeholder="该规格C端价格"  autoComplete="off" class="layui-input">`+
            `</div>`+
            `<div class="layui-inline">`+
            `<input type="text" name="spec[price_inner][]" placeholder="该规格内购价格"  autoComplete="off" class="layui-input">`+
            `</div>`+
            // `<div class="layui-inline">`+
            // `<input type="text" name="spec[price_gift][]" placeholder="请输入该规格采购送礼价"  autoComplete="off" class="layui-input">`+
            // `</div>`+
            // `<div class="layui-inline">`+
            // `<input type="text" name="spec[rest_num][]" placeholder="请输入该规格库存"  autoComplete="off" class="layui-input">`+
            // `</div>`+
            `<div class="layui-inline layui-show-xs-block"  style="margin-left: 45px;">`+
            `<a class="layui-btn layui-btn-xs add">添加</a>`+
            `<a class="layui-btn layui-btn-danger layui-btn-xs del">删除</a>`+
            `</div>`+
            `</div>`;
        //添加到表格最后
        $('#spec').append(html);

        // 图片上传
        uploadApi.image({
            elem: `#select-img${i}`,
            bindAction: `#upload-img${i}`,
            resetAction: `#reset-img${i}`,
        }, {
            resource: {}
        });
    });
    // 删除规格
    $('#spec').on('click', '.del', function() {

        if ($('#spec div label').length === 1) {
            layer.msg('只有一条不允许删除。', {
                time : 2000
            });
        } else {
            //删除当前按钮所在的tr
            $(this).closest('div .layui-form-item').remove();
        }
    });
});

layui.use(['form', 'layedit'], function () {
    var form=layui.form,layedit=layui.layedit;
    var index1 = layedit.build('LAY_demo1', {
            tool: ['strong', 'italic', 'underline', 'del', '|', 'left', 'center', 'right'],
            height: 200
        });
});


//单击图片删除图片 【注册全局函数】
function delMultipleImgs(this_img){
    if(multiple_images.length==0){
        multiple_images = $(".multiple_show_img").val();
        if(multiple_images){
            multiple_images = multiple_images.split(',');
        }
    }
    //获取下标
    var subscript=$("#div-slide_show img").index(this_img);
    //删除图片
    this_img.remove();
    //删除数组
    multiple_images.splice(subscript, 1);
    //重新排序
    multiple_images.sort();
    $('.multiple_show_img').val(multiple_images);
    //返回
    return ;
}
</script>
<!--
/**
 * editor 富文本编辑器
 * @param array $obj 编辑器的容器ID
 * @param string $name [为了方便大家能在系统设置里面灵活选择编辑器，建议不要指定此参数]，目前支持的编辑器[ueditor,umeditor,ckeditor,kindeditor]
 * @param string $upload [选填]附件上传地址
 */
-->
{:editor(['UMeditor1', 'UMeditor2'])}
{:editor(['kindeditor1', 'kindeditor2'], 'kindeditor')}
<!-- {:editor(['UEditor1', 'UEditor2'], 'ueditor')}
{:editor(['ckeditor', 'ckeditor2'], 'ckeditor')} -->